<template>
    <div style="width: 100%;height: 100%;">
        <el-header style="height: 10%;width: 100%">
          <h1>学生端</h1>
        </el-header>
        <el-container style="height: 90%;width: 100%">
            <el-aside style="height: 100%;width: 15%">
              <div class="a">
                <div class="center">
                  <img class="cirLogo" src="../../assets/icon/score.png"/>
                </div>
                <div style="width: 100%;height:50px;position: relative">
                  <el-button @click="personCenter" style="width:40%;float: left;">个人中心</el-button>
                  <el-button @click="exitAccount" style="width:40%;float: right;">退出账号</el-button>
                </div>
              </div>
              <el-menu :default-openeds="['2']">
                <el-menu-item index="1"><img style="width: 30px;height: 30px;" src="../../assets/icon/score.png"/>首页</el-menu-item>
                <el-submenu index="2">                  
                  <template slot="title"><img style="width: 40px;height: 40px;" src="../../assets/icon/exam.png"/>考试</template>
                  <el-menu-item index="2-1">未开始</el-menu-item>
                  <el-menu-item index="2-2">进行中</el-menu-item>
                  <el-menu-item index="2-3">已结束</el-menu-item>
                </el-submenu>
                <el-menu-item index="3"><img style="width: 30px;height: 30px;" src="../../assets/icon/score.png"/>成绩</el-menu-item>
                <el-submenu index="4">                  
                  <template slot="title"><img style="width: 35px;height: 35px;" src="../../assets/icon/errSum.png"/>错题</template>
                  <el-menu-item index="4-1">收藏的错题</el-menu-item>
                  <el-menu-item index="4-2">收藏的试卷</el-menu-item>
                  <el-menu-item index="4-3">心得总结</el-menu-item>
                </el-submenu>
              </el-menu>
            </el-aside>
            <el-main style="height: 100%;width: 85%">
              <div style="width:100%;height:100%;">
                <router-view></router-view>
              </div>
            </el-main>
        </el-container>
    </div>
</template>

<script>
export default {
    name: 'StudentInteerface',
    data() {
        return {
            value: 'true',
            input: ''
        }
    },
    mounted() {
      this.$router.push('./studentmainpage')
    }
}
</script>

<style lang="less" scoped>
.el-header {
    background-color: #B3C0D1;
    color: #333;
    text-align: center;
}
.el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
}
.el-main {
     background-color: #E9EEF3;
    color: #333;
    text-align: center;
}  
.a {
  display: block;
  width: 100%;
  height:120px;
}
.center {
  display: flex;
  width: 100%;
  height: 60%;
  justify-content: center;
  align-content: center;
  // margin-bottom: 5px;
  margin-top: 5px;
}
.cirLogo {
   width: 60px;
   height:60px;
   background-size:100% 100%;
   margin-top:5px;
   border-radius: 50%;
}
</style>